<script setup lang="ts">
import type { NuxtError } from "#app"

defineProps<{
  error: NuxtError
}>()

const handleError = () => clearError({ redirect: "/" });
const variantClasses = {
  primary: tw`bg-red-400`,
  secondary: tw('bg-green-400 text-white'),
}
</script>

<template>
  <div class="flex items-center justify-center flex-col gap-8 mt-10">
    <h2 class="font-bold text-4xl">
      错误状态: {{ error.statusCode }}
    </h2>
    <h2 class="text-red-600 text-2xl max-w-4/5">
      错误信息: {{ error.message }}
    </h2>
    <UButton
      class="w-36 text-2xl justify-center"
      @click="handleError"
    >
      清除错误
    </UButton>
  </div>
</template>

<style scoped lang="postcss"></style>
